<style>
    .form-lib-poem .poem-content {
        height: 320px !important;
    }
    .form-lib-poem .poem-description {
        width: 95% !important;
        height: 200px;
    }

    .box-pop {
        position: absolute;
        padding: 5px;
        width: 50%;
        top: 100px;
        left: 300px;
        background: green;
    }
    .box-pop img {
        width: 100%;
    }
    .box-pop .pop-content {
        background: white;
        color: black;
        display: flex;
        flex-direction: row;
        padding: 10px 10px 20px 10px;
    }
    .box-pop .pop-content .column {
        display: flex;
        flex-direction: column;
    }
    .box-pop .pop-content .poem-title {
        font-weight: bold;
    }
    .box-pop .pop-content .poem-poet {
        font-size: 12px;
        padding-left: 50px;
    }
    .box-pop .pop-content .poem-content {
        margin-top: 10px;
    }
    .box-pop .pop-content .poem-annotation {
        background: #eff;
        padding: 10px;
    }
    .box-pop .pop-content .poem-annotation .label-title {
        font-weight: bold;
    }
    .box-pop .pop-content .poem-translation {
        background: #eee;
        padding: 10px;
    }
    .box-pop .pop-content .poem-translation .label-title {
        font-weight: bold;
    }
    .box-pop .pop-content .poem-description {
        background: #eee;
        padding: 10px;
        font-family: "Microsoft Yahei";
    }
</style>
<form id="form_add_lib_poem_in_m51" method="post" action="#" class="form form-2column form-lib-poem">
    <input type="hidden" name="datagrid_code" value="lib_poem_m51">
    <div class="column-left">
        <dl class="row">
            <dt class="tit">
                <label><em>*</em>诗词名</label>
            </dt>
            <dd class="opt">
                <input type="text" value="" name="poem_title" class="input-txt">
            </dd>
        </dl>
        <dl class="row">
            <dt class="tit">
                <label>朝代</label>
            </dt>
            <dd class="opt">
                <input type="text" value="" name="dynasty" class="input-txt">
            </dd>
        </dl>

        <dl class="row">
            <dt class="tit">
                <label>诗人</label>
            </dt>
            <dd class="opt">
                <input type="text" value="" name="poet" class="input-txt">
            </dd>
        </dl>
        <dl class="row">
            <dt class="tit">
                <label>内容</label>
            </dt>
            <dd class="opt">
                <textarea name="poem_content" class="poem-content"
                          maxlength=1000></textarea>
            </dd>
        </dl>
    </div>
    <div class="column-right">
        <textarea name="annotation" class="poem-description" placeholder="请输入诗词注释"></textarea>
        <textarea name="translation" class="poem-description" placeholder="请输入诗词译文"></textarea>
        <textarea name="appreciation" class="poem-description" placeholder="请输入诗词赏析"></textarea>
        <textarea name="background" class="poem-description" placeholder="请输入诗词创作背景"></textarea>
    </div>
</form>
